/**
 * Vue表单数据收集
 * 1. input类型为text,password,number时,v-model收集的是value值,即用户输入值
 * 2. input类型值为radio时,v-model收集的是标签配置的value值
 * 3. input类型为checkbox时
 *  - 没有配置input的value属性,则收集的是checked (布尔值)
 *  - 配置了input的value属性
 *    - 如果v-model初始值为数组,收集的值为数组
 *    - 如果v-model初始值为非数组,收集的值就是checked(布尔值)
 * 4. v-model的三个修饰符
 *   - lazy  失去焦点再去收集
 *   - number 输入字符串转为有效数字
 *   - trim 去掉首尾空格
 */

// 阻止Vue在启动时生成生产提示
Vue.config.productionTip = false;
new Vue({
	el: "#root",// 用于指定当前Vue实例在为哪个容器服务,通常为css选择器 也可以写为 document.getElementById("root")
	data: {// data用于存储数据,数据供el指定的容器使用,
		form: {
			name: "",
			pwd: "",
			age: "",
			sex: "",
			hobby: [],
			city: "",
			agree: "",
			intro: ""
		},
		school: [
			{name: "北京", value: "beijing"},
			{name: "深圳", value: "shenzhen"},
			{name: "上海", value: "shangai"},
			{name: "武汉", value: "wuhan"},
		],
		hobby: [
			{name: "学习", value: "study"},
			{name: "打游戏", value: "game"},
			{name: "吃饭", value: "eat"},
		],
		sex: [
			{name: "男", value: "male"},
			{name: "女", value: "female"},
		]
	},
	methods: {
		login(e) {
			console.log(this.form)
			e.preventDefault();
			return false;
		}
	}
});
